<template>
   <!----<p class="latexDiv">$p(X)= \mathsf {P}(Y=1 \mid X)$</p> -->
   <p class="latexDiv" v-html="rawHtml" ></p>
</template>

<script> 
export default { 
    props: { 
        value: {
            
        }
     },
     data() { 
        return  {
             rawHtml:'$$R_{再生水}=\\sum_{j=1}^{n}(Q_{j再生水}-Q_{j再生水上年})\\times C_{ji当年}\\times10^{-2}$$',
         }; 
     },
     created() { // 组件刚创建的时候，watch并不会被触发，因为latex值没发生变化
      this.formatMath()
     },
    methods: {
        formatMath() {
                let that = this;
                setTimeout(function () {
                    that.$nextTick(function () {
                        if (this.commonsVariable.isMathjaxConfig) {//判断是否初始配置，若无则配置。
                            this.commonsVariable.initMathjaxConfig();
                        }
                        this.commonsVariable.MathQueue("latexDiv");//传入组件id，让组件被MathJax渲染
                    })
                }, 200);
            },
    },
    mounted() { 
        this.$nextTick(function () { //这里要注意，使用$nextTick等组件数据渲染完之后再调用MathJax渲染方法，要不然会获取不到数据
    if(this.commonsVariable.isMathjaxConfig){//判断是否初始配置，若无则配置。
        this.commonsVariable.initMathjaxConfig();
    }
    this.commonsVariable.MathQueue("question-id");//传入组件id，让组件被MathJax渲染
})  
    }
} 
 </script>